<template>
  <div class="illnessInquiry">
    <GhNavBar title="心理疾病百科"  />
    <div class="content">
       <img src="https://img.redocn.com/sheji/20211027/xinlijiankanghaibao_11804625.jpg.400.jpg" alt="">
      <van-collapse v-model="activeName" class="father-box" accordion>
        <van-collapse-item class="son-box"  name="1">
         <template #title>
          <span>抑郁症</span>
         </template>
         <img src="https://img0.baidu.com/it/u=3366352389,2554182493&fm=253&fmt=auto&app=120&f=JPEG?w=1025&h=695" alt="">
        <p>
         &nbsp;&nbsp;抑郁症是一种常见的精神障碍，以显著而持续的心境低落为主要特征，伴随着兴趣减退和愉快感的丧失，常常影响个体的工作、学习和社交功能。抑郁症可能是由多种因素引起的，包括遗传、生物学、心理社会和环境因素。临床上的病症标准为持续发作两周以上。
        </p>
        <p>
        &nbsp;&nbsp;典型的症状包括情绪低落、失眠或睡眠过度、食欲改变、疲劳、自卑感或无价值感、过度自责、注意力难以集中等。严重者可能出现幻觉、妄想等症状，甚至自杀观念或行为。据世界卫生组织调查显示，抑郁症影响着全球约2.8亿人。
       </p>
        </van-collapse-item>
        <van-collapse-item  name="2">
          <template #title>
            <span>焦虑症</span>
           </template>
           <img src="https://p2.itc.cn/images03/20200527/b55a0741ec9c4d38a7c150f4de6dab8e.jpeg" alt="">
          <p> &nbsp;&nbsp;焦虑症（anxiety），又称为焦虑性神经症，是神经症这一大类疾病中最常见的一种，以焦虑情绪体验为主要特征。可分为慢性焦虑，即广泛性焦虑（generalized anxiety）和急性焦虑，即惊恐发作（panic attack）两种形式。</p>
          <p> &nbsp;&nbsp;主要表现为：无明确客观对象的紧张担心，坐立不安，还有植物神经功能失调症状，如心悸、手抖、出汗、尿频等，及运动性不安。注意区分正常的焦虑情绪，如焦虑严重程度与客观事实或处境明显不符，或持续时间过长，则可能为病理性的焦虑。
          </p>
        </van-collapse-item>
        <van-collapse-item name="3">
          <template #title>
            <span>精神分裂症</span>
           </template>
           <img src="https://img2.baidu.com/it/u=700991334,1593204970&fm=253&fmt=auto&app=138&f=PNG?w=500&h=308" alt="">
           <p>
            &nbsp;&nbsp;精神分裂症，简称精神分裂，是一组病因未明的慢性疾病，多在青壮年缓慢或亚急性起病，临床上往往表现为症状各异的综合征，涉及感知觉、思维、情感和行为等多方面的障碍以及精神活动的不协调。
          </p>
          <p>
            &nbsp;&nbsp; 患者一般意识清楚，智能基本正常，但部分患者在疾病过程中会出现认知功能的损害。病程一般迁延，呈反复发作、加重或恶化，部分患者最终出现衰退和精神残疾，但有的患者经过药物治疗与心理治疗后可保持痊愈或基本痊愈状态。
          </p>
          </van-collapse-item>
        <van-collapse-item name="4">
          <template #title>
            <span>强迫症</span>
           </template>
           <img src="https://img0.baidu.com/it/u=1472506130,2375706560&fm=253&fmt=auto&app=138&f=JPEG?w=628&h=438" alt="">
           <p> &nbsp;&nbsp; 强迫症（OCD）属于焦虑障碍的一种类型，是一组以强迫思维和强迫行为为主要临床表现的神经精神疾病，其特点为有意识的强迫和反强迫并存，一些毫无意义、甚至违背自己意愿的想法或冲动反反复复侵入患者的日常生活。患者虽体验到这些想法或冲动是来源于自身，极力抵抗，但始终无法控制，二者强烈的冲突使其感到巨大的焦虑和痛苦，影响学习工作、人际交往甚至生活起居。</p>
        </van-collapse-item>
      </van-collapse>
      
    </div>
  </div>
</template>

<script setup>
import {ref,onMounted} from "vue"
import GhNavBar from '@/components/gh-nav-bar.vue'

const activeName = ref('');
</script>

<style lang="scss" scoped>
.illnessInquiry{
  .content{
     padding-top: 48px;
     img{
      display: block;
      width: 100%;
      height: 150px;
      border-radius: 10px;

     }

    .father-box{
       display: flex;
       flex-direction: column;
       justify-content: space-between;
      text-align: center;
      margin-top: 20px;
      /* height: 200px ; */
      overflow: auto;
      img{
        position: relative;
        transform: translate(-50%);
        margin-bottom: 5px;
        left: 50%;
        display: block;
        height: 80px;
        width: 100px;
      }
      span{
        /* font-size: 20px; */
        font-family: '宋体';
        color: var(--gh-orange);
        font-weight: bold;
        letter-spacing: 0.2rem;
      font-size: 1.5rem;
       background-image: -webkit-linear-gradient(left, #147B96, #E6D205 25%, #147B96 50%, #E6D205 75%, #147B96);
       -webkit-text-fill-color: transparent;
       -webkit-background-clip: text;
       -webkit-background-size: 200% 100%;
       -webkit-animation: maskedAnimation 4s infinite linear;
      }
      p{
        /* height: 20px; */
        font-size: 16px;
        font-family: '宋体';
        color: var(--gh-primary);
        text-align: left;
       }

    }
   
  }
}

@keyframes maskedAnimation {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: -100% 0;
    }
}

</style>
